<style>
    /*#peccancyRecord-detail .layui-input-block {*/
    /*    margin-left: 160px;*/
    /*}*/

    /*#peccancyRecord-detail .layui-form-label {*/
    /*    width: 128px;*/
    /*}*/
</style>
<div class="layui-fluid" id="peccancyRecord-detailt">
    <div class="febs-open-body">
        <form class="layui-form" action="" lay-filter="peccancyRecord-detail-form">
            <fieldset class="layui-elem-field">
                <legend id="user_field">违章人员信息</legend>
                <div class="layui-field-box">
                    <div class="layui-form-item febs-hide">
                        <div class="layui-row">
                            <div class="layui-col-xs6">
                                <label class="layui-form-label febs-form-item-require">id：</label>
                                <div class="layui-input-block">
                                    <input type="text" name="informationId" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-col-xs6">
                                <label class="layui-form-label febs-form-item-require">公司Id：</label>
                                <div class="layui-input-block">
                                    <input type="text" name="tenantId" autocomplete="off" class="layui-input"
                                           maxlength="32">
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">

                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章人员：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyRealName}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">人员类型：</label>
                            <div th:switch="${peccancyInformation.peccancyUserType}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">本工</div>
                                <div th:case="2" class="layui-input-block layui-input-block-html">外包</div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">身份证号：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserIdentificationNo}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">人员工号：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserNo}"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">所属部门：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserDept}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">岗位名称：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserPostName}"></div>
                        </div>
                    </div>
                    <div th:if="${peccancyInformation.peccancyUserType eq '2'}">
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">所属承包方：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserContractorName}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">所属承包队：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyUserContractorTeamName}"></div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail" style="color: red">违章次数：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${countYear.yearCount}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail" style="color: red">罚款金额：</label>
                            <div class="layui-input-block layui-input-block-html" data-th-text="${countYear.amountCount}"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail" style="color: red">扣除积分：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${countYear.scoreCount}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail" style="color: red">视频学习：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${countYear.videoCount}"></div>
                        </div>
                    </div>
                </div>
            </fieldset>
            <fieldset class="layui-elem-field">
                <legend id="project_field">违章项目信息</legend>
                <div class="layui-field-box">
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章单号：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyNo}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">所属公司：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.tenantName}"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">所属业务：</label>
                            <div th:switch="${peccancyInformation.businessType}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">海工</div>
                                <div th:case="2" class="layui-input-block layui-input-block-html">修船</div>
                                <div th:case="3" class="layui-input-block layui-input-block-html">造船</div>
                                <div th:case="4" class="layui-input-block layui-input-block-html">场地</div>
                            </div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">项目名称：</label>
                            <div class="layui-input-block layui-input-block-html"th:text="${peccancyInformation.projectName}" >

                            </div>
                        </div>
                        <!--                        <div class="layui-col-md6">-->
                        <!--                            <label class="layui-form-label layui-form-label-detail">违章地点：</label>-->
                        <!--                            <div class="layui-input-block" th:text="${peccancyInformation.peccancyAxis}"></div>-->
                        <!--                        </div>-->
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章区域：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyArea}"></div>
                        </div>

                    </div>
                </div>
            </fieldset>

            <fieldset class="layui-elem-field">
                <legend id="peccancy_field">违章信息</legend>
                <div class="layui-field-box">

                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章类型：</label>
                            <div class="layui-input-block layui-input-block-html" id="peccancyType" ></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">作业类别：</label>
                            <div class="layui-input-block layui-input-block-html" id="jobOperation" ></div>
                        </div>

                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章原因：</label>
                            <div class="layui-input-block layui-input-block-html" id="peccancyRootCause" ></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章性质：</label>
                            <div th:switch="${peccancyInformation.peccancyNature}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">一般</div>
                                <div th:case="2" class="layui-input-block layui-input-block-html">较重</div>
                                <div th:case="3" class="layui-input-block layui-input-block-html">严重</div>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">违章时间：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.peccancyTime}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">是否现场：</label>
                            <div th:switch="${peccancyInformation.isScene}">
                                <div th:case="1" class="layui-input-block layui-input-block-html">是</div>
                                <div th:case="0" class="layui-input-block layui-input-block-html">否</div>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">

                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">条款类型：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.clauseName}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">处理形式：</label>
                            <div class="layui-input-block layui-input-block-html" id="disposeForm"></div>
                        </div>
                    </div>


                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">惩罚原因：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.reason}"></div>
                        </div>

                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md12">
                            <label class="layui-form-label layui-form-label-detail">照片：</label>
                            <div class="layui-input-block layui-input-block-html">
                                <div id="fileUpload" style="height: 120px ;width: 100%">
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail" style="width: 84px">违章人签名：</label>
                            <div class="layui-input-block layui-input-block-html" style="margin-left: 114px"
                                 th:text="${peccancyInformation.peccancyUserSign}"></div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">开单人：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.invoiceRealName}"></div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label layui-form-label-detail">开单时间：</label>
                            <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.invoiceDate}"></div>
                        </div>

                    </div>
                </div>
            </fieldset>

            <div th:if="${peccancyInformation.status} > 2">
                <fieldset class="layui-elem-field">
                    <legend id="audit_field">审核信息</legend>
                    <div class="layui-field-box">
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">违章性质：</label>
                                <div th:switch="${peccancyInformation.peccancyNature}">
                                    <div th:case="1" class="layui-input-block layui-input-block-html">一般</div>
                                    <div th:case="2" class="layui-input-block layui-input-block-html">较重</div>
                                    <div th:case="3" class="layui-input-block layui-input-block-html">严重</div>
                                </div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">审核结果：</label>
                                <div th:if="${peccancyInformation.status eq '3'}">
                                    <div class="layui-input-block layui-input-block-html">审核退回</div>
                                </div>
                                <div th:if="${peccancyInformation.status ge '3'}">
                                    <div class="layui-input-block layui-input-block-html">审核通过</div>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item" th:if="${peccancyInformation.status} >3">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">处理方式：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.learnVideoFlg eq '1' ? '视频学习+':''}+
                            ${peccancyInformation.penaltyAmountFlg eq '1' ? '罚款+':''}+
                            ${peccancyInformation.penaltyScoreFlg eq '1' ? '扣分':''}"></div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">审核人：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.auditRealName}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">审核时间：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.auditDate}"></div>
                            </div>
                        </div>
                    </div>
                </fieldset>
            </div>

            <div th:if="${peccancyInformation.appeaFlg eq '1'}">
                <fieldset class="layui-elem-field">
                    <legend id="appeal_field">申诉信息</legend>
                    <div class="layui-field-box">
                        <div class="layui-form-item">
                            <div class="layui-col-md12">
                                <label class="layui-form-label layui-form-label-detail">申诉信息：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.appealReason}"></div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">申诉人：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.appealRealName}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">申诉时间：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.appealTime}"></div>
                            </div>
                        </div>
                    </div>
                </fieldset>
            </div>

            <div th:if="${peccancyInformation.status} > 4">
                <fieldset class="layui-elem-field">
                    <legend id="audtit_field">签发</legend>
                    <div class="layui-field-box">
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">签发结果：</label>
                                <div th:if="${peccancyInformation.status eq '10'}">
                                    <div class="layui-input-block layui-input-block-html">作废</div>
                                </div>
                                <div th:if="${peccancyInformation.status eq '6'}">
                                    <div class="layui-input-block layui-input-block-html">已签发</div>
                                </div>
                                <div th:if="${peccancyInformation.status eq '5'}">
                                    <div class="layui-input-block layui-input-block-html">签发退回</div>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-col-md12">
                                <label class="layui-form-label layui-form-label-detail">签发备注：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.issuanceRemark}">
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">签发人：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.issuanceRealName}"></div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label layui-form-label-detail">签发时间：</label>
                                <div class="layui-input-block layui-input-block-html" th:text="${peccancyInformation.issuanceDate}"></div>
                            </div>
                        </div>
                    </div>
                </fieldset>
            </div>
        </form>
    </div>
</div>
<div style="height: 45%" class="febs-container" id="baseCautionaryLesson-edit">
    <div class="febs-open-body">
        <form class="layui-form" action="" lay-filter="baseCautionaryLesson-edit-form" style="padding-top: 30px">
            <fieldset class="layui-elem-field">
                <legend id="lesson_field">学习情况</legend>
                <div class="layui-form-item febs-hide">
                    <label class="layui-form-label febs-form-item-require">：</label>
                    <div class="layui-input-block">
                        <input type="text" name="cautionaryLessonId" class="layui-input">
                        <input type="text" name="tenantId" autocomplete="off" class="layui-input"
                               maxlength="32" >
                        <input type="text" name="cautionarySourceId" autocomplete="off" class="layui-input"
                               maxlength="32" >
                        <input type="text" name="cautionaryDeptId" autocomplete="off" class="layui-input"
                               maxlength="32" >
                    </div>
                </div>
                <div class="layui-form-item febs-hide">
                    <div class="layui-row">
                        <div class="layui-col-xs12">
                            <label class="layui-form-label">学习时间：</label>
                            <div class="layui-input-block">
                                <input type="text" name="studyDate" id="studyDate" lay-verify="datetime"
                                       placeholder="请输入时间" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-row">
                        <div class="layui-col-xs12">
                            <label class="layui-form-label febs-form-item-require">学习备注：</label>
                            <div class="layui-input-block">
                                <textarea name="studyRemark" class="layui-textarea" maxlength="900" placeholder="请输入备注" lay-verify="required"></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item febs-hide">
                    <div class="layui-row">
                        <div class="layui-col-xs12">
                            <label class="layui-form-label febs-form-item-require">警示状态：</label>
                            <div class="layui-input-block">
                                <select name="status" id="status" lay-search="">
                                    <option value="0">待学习</option>
                                    <option value="1">已学习</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-row">
                        <div class="layui-col-xs12">
                            <label class="layui-form-label">附件上传：</label>
                            <div class="layui-input-block" id="uploadBtn">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item febs-hide">
                    <button class="layui-btn" lay-submit="" lay-filter="baseCautionaryLesson-edit-form-submit" id="submit"></button>
                    <button type="reset" class="layui-btn" id="reset"></button>
                </div>
            </fieldset>
        </form>
    </div>
</div>
<script data-th-inline="javascript">
    var peccancyInformation = [[${peccancyInformation}]];
    var baseCautionaryLessonData = [[${baseCautionaryLesson}]];
</script>
<script>
    layui.use(['jquery','febs', 'form', 'validate', 'fileUpload', 'fileUpload','autocomplete','commonJS','fileUpload'], function () {
        var $ = layui.$,
            febs = layui.febs,
            form = layui.form,
            fileUpload = layui.fileUpload,
            $view = $('#peccancyRecord-detail'),
            $lessonView = $('#baseCautionaryLesson-edit'),
            validate = layui.validate;


        var tenantId = POPUP_DATA.tenantId;
        var fileList = [];

        form.verify(validate);
        form.render();
        initFormValue();
        initFormLessonValue();

        var fileUploadDiv = fileUpload.render({
            elem: '#fileUpload',
            url: ctx + 'hazard/upload',
            type: 0,//0-图片，1-视频，2-其他
            maxNum:5,
            defaultData: peccancyInformation && peccancyInformation.fileList ? peccancyInformation.fileList:[],
            isDetail: true,
            done: function (res) {
            },
        });


        function initFormValue() {
            if(peccancyInformation.peccancyType){
                febs.initDictItemLabel($view.find('#peccancyType'),'SAFETY_PECCANCY_TYPE',peccancyInformation.peccancyType)
            }
            if(peccancyInformation.peccancyRootCause){
                febs.initDictItemLabel($view.find('#peccancyRootCause'),'SAFETY_PECCANCY_ROOT_REASON',peccancyInformation.peccancyRootCause)
            }
            if(peccancyInformation.jobOperation){
                febs.initDictItemLabel($view.find('#jobOperation'),'SAFETY_JOB_OPERATION',peccancyInformation.jobOperation)
            }
            if(peccancyInformation.disposeForm){
                febs.initDictItemLabel($view.find('#disposeForm'),'SAFETY_PECCANCY_DISPOSE_FORM',peccancyInformation.disposeForm)
            }
        }

        function getFileList() {
            if (peccancyInformationData && peccancyInformationData.fileList.length>0) {
                return  peccancyInformationData.fileList;
            }else {
                return  [];
            }
        }

        function initFormLessonValue() {
            if (baseCautionaryLessonData) {
                form.val("baseCautionaryLesson-edit-form", {
                    "cautionaryLessonId": baseCautionaryLessonData.cautionaryLessonId,
                    "tenantId": baseCautionaryLessonData.tenantId,
                    "cautionarySource": baseCautionaryLessonData.cautionarySource,
                    "cautionarySourceId": baseCautionaryLessonData.cautionarySourceId,
                    "cautionaryTitle": baseCautionaryLessonData.cautionaryTitle,
                    "cautionaryDeptId": baseCautionaryLessonData.cautionaryDeptId,
                    "cautionaryDept": baseCautionaryLessonData.cautionaryDept,
                    "studyDate": baseCautionaryLessonData.studyDate,
                    "studyRemark": baseCautionaryLessonData.studyRemark,
                    "status": baseCautionaryLessonData.status,
                });
                if(baseCautionaryLessonData.uploadFileInfo != null){
                    fileList.push(baseCautionaryLessonData.uploadFileInfo);
                }
            }
        }

        fileUpload.render({
            elem:'#uploadBtn',
            url:ctx + 'base/upload',
            type:'2',
            maxNum:1,
            defaultData: fileList.length>0 ? fileList:[],
            done:function(res){
            }
            ,error: function(){
                layer.msg("服务器异常")
            }
        })

        form.on('submit(baseCautionaryLesson-edit-form-submit)', function (data) {
            addOrUpdate(data.field);
            return false;
        });

        function addOrUpdate(data) {
            data.tenantId = tenantId;
            data.uploadFileInfo = getFileData();
            console.log(data);
            febs.modal.confirm("保存提示！","是否保存？",function (index){
                if (data.cautionaryLessonId && data.cautionaryLessonId.length > 0) {
                    febs.postArray(ctx + 'baseCautionaryLesson/update', data, function () {
                        layer.closeAll();
                        febs.alert.success('修改成功');
                        $('#febs-baseCautionaryLesson').find('#query').trigger('click');
                    });
                } else {
                    febs.postArray(ctx + 'baseCautionaryLesson', data, function () {
                        layer.closeAll();
                        febs.alert.success('新增成功');
                        $('#febs-baseCautionaryLesson').find('#query').trigger('click');
                    });
                }
            })
        }

        function getFileData(){
            var fileDatas = $lessonView.find(".fileOne")
            var fileList = [];
            $.each(fileDatas,function (index, item){
                var data = {
                    filePath: item.dataset.filepath,
                    fileName: item.dataset.filename,
                    smallPath: item.dataset.smallpath,
                }
                fileList.push(data);
            })
            return fileList[0];
        }

    });
</script>